<template>
	<view>
		<view class="btns">
			<view :style="{backgroundColor: item.color}" v-for="(item, key) in btnList" :key="key">
				{{item.name}}
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		onLoad() {
			
		},
		data(){
			return{
				btnList: {
					notStart: {
						name: '可研',
						color: '#b9b8be',
						state: 1
					},
					build: {
						name: '初步设计',
						color: '#b9b8be',
						state: 2
					},
					finish: {
						name: '施工图',
						color: '#b9b8be',
						state: 3
					},
					notInvolved: {
						name: '竣工图',
						color: '#b9b8be',
						state: 4
					},
				},
			}
		},
		methods:{
			
		}
	}
</script>

<style lang="scss" scoped>
	
	.btns {
		box-sizing: border-box;
		width: 600rpx;
		margin: 0 auto;
		padding-top: 15rpx;
		padding-right: 15rpx;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	
		.btn {
			width: 184rpx;
			height: 48rpx;
			background-color: #00cdb4;
			border-radius: 24rpx;
			text-align: center;
			line-height: 48rpx;
			font-size: 26rpx;
			color: #fff;
			margin-bottom: 25rpx;
		}
	
		.notStart {
			box-sizing: border-box;
			background-color: #fff;
			color: #3b3c40;
			border: 3rpx solid #3b3c40;
			line-height: 42rpx;
		}
	}
	
</style>
